<template>
	<view>
		<!-- :default-selector="[2]" -->
		<u-picker title="选择路线" :value.sync="show" mode="selector" :range="range" @confirm="handleConfirm" @cancel="cancel">
		</u-picker>
	</view>

	<!-- <el-dialog width="90%" :title="$t('选择路线')" destroy-on-close append-to-body :visible.sync="show"
			:before-close="cancel">
			<el-form @submit.native.prevent ref="formRef" :model="form" :rules="rules">
				<el-form-item :label="$t('路线')" prop="routeId">
					<el-select style="width: 100%" clearable filterable :placeholder="$t('请选择')" v-model="form.routeId">
						<el-option v-for="item in routes" :label="item.routeNo" :value="item.id" :key="item.id" />
					</el-select>
				</el-form-item>
			</el-form>
			<div slot="footer">
				<el-button @click="handleSubmit" type="primary">{{ $t('确认') }}</el-button>
				<el-button @click="cancel">{{ $t('关闭') }}</el-button>
			</div>
		</el-dialog> -->
</template>

<script>
	export default {
		props: {
			/**
			 * routes
			 */
			routes: {
				type: Array,
				default: () => [],
			},
			/**
			 * 控制显示隐藏
			 */
			show: {
				type: Boolean,
				required: true,
				default: false,
			},
		},
		data() {
			return {
				range: null,
				value: '',
				// 表单参数
				form: {
					routeId: '',
				},
				// 表单校验
				rules: {
					routeId: [{
						required: true,
						message: this.$t('请输入'),
						trigger: 'blur'
					}],
				},
			}
		},
		computed: {},
		watch: {
			show: function(newValue) {
				if (newValue) {
					// Object.keys(this.form).forEach((key) => (this.form[key] = ''))
					this.form.routeId = null
					this.range = this.routes.map(i => i.routeNo)
				}
			},
		},
		methods: {
			getList() {},

			handleConfirm(index) {
				const selectItem = this.routes[index]
				uni.reLaunch({
					url: `/pages/map/index?query=${JSON.stringify({
						...selectItem,
					})}`,
				})
				this.cancel()
			},
			cancel() {
				this.$emit('update:show', false)
			},
		},
	}
</script>
<style scoped lang="scss"></style>